<template>
	<!-- 申请提货点 -->
	<view class="Apply_master">
		<!-- #ifdef MP-WEIXIN -->
		<view class="name">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" v-model="name" maxlength="10" placeholder="请输入提货点称" placeholder-style="color:#666;" @blur="getName" />
		</view>
		<!-- #endif -->
		<!-- #ifdef H5 -->
		<view class="name">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="10" placeholder="请输入姓名" placeholder-style="color:#666;" @input="setName" />
		</view>
		<!-- #endif -->
		<view class="tel">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="11" type="number" placeholder="请输入手机号" placeholder-style="color:#666" @blur="getTel" />
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" placeholder="请输入微信号" placeholder-style="color:#666" @blur="getWx" />
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" placeholder="请输入店铺名称" placeholder-style="color:#666" @blur="getshop" />
		</view>
		<view class="dizhi" @tap="openMap">
			<text :style="{ color: newColor.color }">*</text>
			<text style="margin-left: 10upx;color: #666;">{{ address || '请选择地址' }}</text>
			<image src="../../static/image/right.png" mode=""></image>
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" placeholder="请输入具体地址" placeholder-style="color:#666" @blur="getaddres" />
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" disabled placeholder="请选择是否具备冷藏条件" placeholder-style="color:#666" />
			<van-radio-group :value="lctj" @change="onChangeLctj">
			  <van-radio class="vanradio" name="是" icon-size="16px" :checked-color="newColor.color" >
				  是
			  </van-radio>
			  <van-radio class="vanradio" name="否" icon-size="16px" :checked-color="newColor.color" >
				  否
			  </van-radio>
			</van-radio-group>
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" disabled placeholder="请输入是否具备冷冻条件" placeholder-style="color:#666" />
			<van-radio-group :value="ldtj" @change="onChangeLdtj">
			<van-radio class="vanradio" name="是" icon-size="16px" :checked-color="newColor.color" >
							  是
			</van-radio>
			<van-radio class="vanradio" name="否" icon-size="16px" :checked-color="newColor.color" >
							  否
			</van-radio>
			</van-radio-group>
		</view>
		<view class="wx">
			<text :style="{ color: newColor.color }">*</text>
			<input class="uni-input" maxlength="16" disabled placeholder="请输入是否具备服务点力" placeholder-style="color:#666"  />
			<van-radio-group :value="tznl" @change="onChangeTznl">
			 <van-radio class="vanradio" name="是" icon-size="16px" :checked-color="newColor.color" >
			 				  是
			 </van-radio>
			 <van-radio class="vanradio" name="否" icon-size="16px" :checked-color="newColor.color" >
			 				  否
			 </van-radio>
			</van-radio-group>
		</view>
		<view class="wx" v-if="shows == true">
			<input class="uni-input" maxlength="16" placeholder="请输入预备粉丝群体" placeholder-style="color:#666" v-model="ybfsqt" />
		</view>
		<view class="wx" v-if="shows == true">
			<input class="uni-input" maxlength="16" placeholder="请输入粉丝预计数量" placeholder-style="color:#666" v-model="yjfssl" />
		</view>
		<view class="wx" v-if="shows == true">
			<input class="uni-input" maxlength="16" placeholder="请输入粉丝类型" placeholder-style="color:#666" v-model="fslx" />
		</view>
		<view class="wx" v-if="shows == true">
			<input class="uni-input" maxlength="16" disabled placeholder="本人是否管理过粉丝" placeholder-style="color:#666" />
			<van-radio-group :value="glfs" @change="onChangeGlfs">
			 <van-radio class="vanradio" name="是" icon-size="16px" :checked-color="newColor.color" >
			 				  是
			 </van-radio>
			 <van-radio class="vanradio" name="否" icon-size="16px" :checked-color="newColor.color" >
			 				  否
			 </van-radio>
			</van-radio-group>
		</view>
		<view class="tips">
			<text>备注:</text>
			<textarea placeholder-style="color:#666" placeholder="(选填)" auto-height @blur="getTips" />
		</view>
		<p class="enter" @tap="onsubmit" :style="{ background: newColor.color }">确认提交</p>
		<ourLoading isFullScreen :active="active" text="提交中..." />
		<lb-picker
			:confirm-color="newColor.color"
			empty-text="暂无数据"
			radius="10px"
			mode="multiSelector"
			:level="3"
			@confirm="setCity"
			:list="areaList"
			ref="picker"
			style="border-bottom: none;"
		></lb-picker>
	</view>
</template>

<script>
import LbPicker from '@/components/lb-picker/index.vue';
export default {
	components: {
		LbPicker
	},
	data() {
		return {
			name: '',
			tel: '',
			wx: '',
			tips: '',
			shopname: '',
			address: '',
			active: false,
			areaList: [],
			popshow: false,
			postion: {
				address: '',
				latitude: '',
				longitude: ''
			},
			myaddress: '',
			lctj: '是',
			ldtj: '是',
			tznl: '是',
			ybfsqt: '',
			yjfssl: '',
			fslx: '',
			glfs: '是',
			shows: true
		};
	},
	methods: {
		setName(e) {
			console.log(e);
			let data = e.detail.value;
			let newdata = data.replace(/[^\u4e00-\u9fa5]/g, '');
			console.log(newdata);
			setTimeout(() => {
				this.name = newdata;
			}, 0);
			console.log(this.name);
			return newdata;
		},
		getName(e) {
			this.name = e.detail.value;
		},
		getTel(e) {
			this.tel = e.detail.value;
		},
		getWx(e) {
			this.wx = e.detail.value;
		},
		getTips(e) {
			this.tips = e.detail.value;
		},
		getshop(e) {
			this.shopname = e.detail.value;
		},
		getaddres(e) {
			this.myaddress = e.detail.value;
		},
		onChangeLctj(e){
			console.log(e);
			this.lctj = e.detail
		},
		onChangeLdtj(e){
			this.ldtj = e.detail
		},
		onChangeGlfs(e){
			this.glfs = e.detail
		},
		onChangeTznl(e){
			this.tznl = e.detail
			if(e.detail == '是'){
				this.shows = true
			}else{
				this.shows = false
			}
		},
		// 选择地址
		openMap() {
			// #ifdef MP-WEIXIN
			let that = this;
			uni.chooseLocation({
				success: e => {
					that.postion.address = e.address;
					that.postion.latitude = e.latitude;
					that.postion.longitude = e.longitude;
					that.postion.name = e.name;
					that.address = e.name;
					console.log(that.postion);
				}
			});
			// #endif
			// #ifdef H5
			this.$Router.push({ path: '/pages/home/map' });
			// #endif
		},
		onsubmit() {
			let that = this;
			that.active = true;
			setTimeout(() => {
				that.active = false;
				if (that.name == '') {
					uni.showToast({
						title: '提货点称不能为空',
						icon: 'none'
					});
					return;
				} else if (that.tel == '') {
					uni.showToast({
						title: '手机号不能为空',
						icon: 'none'
					});
					return;
				} else if (that.tel.length > 11) {
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					});
					return;
				} else if (that.wx == '') {
					uni.showToast({
						title: '微信号不能为空',
						icon: 'none'
					});
					return;
				} else if (this.shopname == '') {
					uni.showToast({
						title: '店铺名称不能为空',
						icon: 'none'
					});
					return;
				} else if (this.address == '') {
					uni.showToast({
						title: '请选择地址',
						icon: 'none'
					});
					return;
				} else if (this.myaddress == '') {
					uni.showToast({
						title: '具体地址不能为空',
						icon: 'none'
					});
					return;
				} else if (this.lctj == '') {
					uni.showToast({
						title: '请输入是否具备冷藏条件',
						icon: 'none'
					});
					return;
				} else if (this.ldtj == '') {
					uni.showToast({
						title: '请输入是否具备冷冻条件',
						icon: 'none'
					});
					return;
				} else if (this.tznl == '') {
					uni.showToast({
						title: '请输入是否具备服务点力',
						icon: 'none'
					});
					return;
				}
				this.bindMaster();
			}, 600);
		},
		bindMaster() {
			this.request(
				'user/addPointLeader',
				{
					type: 1,
					user_name: this.name,
					mobile: this.tel,
					wechat: this.wx,
					remark: this.tips,
					address: this.address + this.myaddress,
					lng: this.postion.longitude,
					lat: this.postion.latitude,
					shop_name: this.shopname,
					lctj: this.lctj,
					ldtj: this.ldtj,
					tznl: this.tznl,
					ybfsqt: this.ybfsqt,
					yjfssl: this.yjfssl,
					fslx: this.fslx,
					glfs: this.glfs
				},
				'post'
			).then(res => {
				console.log(res);
				if (res.code == 200) {
					uni.showToast({
						title: '申请成功,请等待审核!',
						icon: 'none'
					});
					setTimeout(() => {
						this.$Router.back(1);
					}, 1500);
				}
				if (res.code == 400) {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					});
				}
			});
		}
	},
	onShow() {
		// #ifdef H5
		if (this.$Route.query.poiaddress) {
			//h5端获取选择地址后返回的地址值
			let postion = this.$Route.query;
			this.address = postion.poiname;
			this.postion.address = postion.poiaddress;
			this.postion.latitude = postion.latlng.lat;
			this.postion.longitude = postion.latlng.lng;
		}
		// #endif
	}
};
</script>

<style lang="scss" scoped>
.Apply_master {
	padding: 20upx 30upx;
	background-color: #ffffff;
	padding-bottom: 50upx;
	> view {
		line-height: 80upx;
		border-bottom: 1upx solid #f2f2f2;
		overflow: hidden;
		> text {
			float: left;
			margin-top: 6upx;
		}
		input {
			height: 80upx;
			line-height: 80upx;
			font-size: 28upx;
			padding-left: 10upx;
		}
	}
	.dizhi {
		overflow: hidden;
		transition: all 0.3s;
		text {
			font-size: 28upx;
			font-family: Droid Sans Fallback;
			font-weight: 400;
			color: rgba(51, 51, 51, 1);
		}
		image {
			width: 12upx;
			height: 22upx;
			float: right;
			margin-top: 30upx;
		}
		&:active {
			transform: scaleX(0.98);
		}
	}
	.tips {
		height: auto;
		overflow: hidden;
		text {
			float: left;
			color: #333333;
			font-size: 28upx;
			margin-left: 20upx;
			width: 10vw;
		}
		/* #ifdef MP-WEIXIN */
		textarea {
			float: left;
			font-size: 28upx;
			margin-top: 30upx;
			padding-left: 10upx;
			width: 70vw;
		}
		/* #endif */

		/* #ifdef H5 */
		textarea {
			float: left;
			font-size: 28upx;
			margin-top: 25upx;
			padding-left: 10upx;
			width: 70vw;
		}
		/* #endif */
	}
	.enter {
		width: 500upx;
		height: 76upx;
		background: rgba(242, 58, 58, 1);
		border-radius: 38upx;
		font-size: 32upx;
		font-family: Droid Sans Fallback;
		font-weight: 400;
		color: rgba(255, 255, 255, 1);
		line-height: 76upx;
		text-align: center;
		margin: 0 auto;
		margin-top: 150upx;
	}
}
/deep/.van-radio{
		margin-top: 10upx;
		font-size: 26upx;
		float: left;
		line-height: 40upx;
		margin-right: 40upx;
		margin-bottom: 20upx;
	}
/deep/.van-radio__label{
	transform: translateY(5upx);
}
</style>
